/**
 * Author: Shen Yanqiu
 * Date: 2017-12-08
 * Time: 10:10
 *
 */
import React from 'react';
import { Table, Button, Modal } from 'antd';
import styles from './List.less';

const confirm = Modal.confirm;

class List extends React.Component {
  state = {
    selectedRowKeys: [], // Check here to configure the default column
  };
  onSelectChange = (selectedRowKeys) => {
    console.log('selectedRowKeys changed: ', selectedRowKeys);
    this.setState({ selectedRowKeys });
  }
  _getColumnConfig () {
    const { onDeleteItem, onSeeItem } = this.props;
    const btnClickHandler = (record, handleType) => {
      handleType === 'see' && onSeeItem(record);
      handleType === 'delete' && confirm({
        title: '你确定要删除本条记录？',
        onOk () {
          onDeleteItem(record.id, record);
        },
      });
    };
    return [{
      title: '活动主题',
      dataIndex: 'content',
      key: 'content',
    }, {
      title: '状态',
      dataIndex: 'status',
      key: 'status',
      // render: () => <span><Badge status="success" />已通过</span>
    }, {
      title: '所属',
      dataIndex: 'owner',
      key: 'owner',
      // render: () => <span><Badge status="success" />已通过</span>
    }, {
      title: '时间',
      dataIndex: 'time',
      key: 'time',
    }, {
      title: '操作',
      key: 'operation',
      width: 150,
      render: (text, record) => {
        return (<div className={styles.operationArea}>
          <Button type="primary" size={'small'} onClick={() => btnClickHandler(record, 'see')}>查看</Button>
          <Button type="danger" size={'small'} onClick={() => btnClickHandler(record, 'delete')}>删除</Button>
        </div>);
      },
    }];
  }
  render () {
    const { selectedRowKeys } = this.state;
    const { ...tableProps } = this.props;
    const rowSelection = {
      selectedRowKeys,
      onChange: this.onSelectChange,
      hideDefaultSelections: false,
      selections: [{
        key: '',
        text: '',
      }],
      onSelection: this.onSelection,
    };
    return (
      <Table
        {...tableProps}
        rowSelection={rowSelection}
        columns={this._getColumnConfig()}
        rowKey={record => record.id}
      />
    );
  }
}

export default List;
